<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script src="node_modules/axios/dist/axios.min.js"></script>

    <script>
      // 删除文章
      axios({
        method: "post",
        url: "http://localhost:4000/graphql",
        data: {
          query: `
            mutation deleteArticle($id: ID!) {
              deleteArticle(id: $id) {
                success
              }
            }
          `,
          variables: {
            id: 1,
          },
        },
      }).then((res) => {
        console.log(res.data.data);
      });

      // 更新文章
      /*axios({
        method: "post",
        url: "http://localhost:4000/graphql",
        data: {
          query: `
            mutation updateArticle($id: ID!, $article: createArticle!) {
              updateArticle(id: $id, article: $article) {
                id
                title
                body
              }
            }
          `,
          variables: {
            id: 1,
            article: {
              title: "GraphQL 入门教程",
              body: "GraphQL 是一个用于 API 的查询语言和运行时。它提供了一种灵活的方式来描述数据，使得客户端能够准确地获取只需的数据，而且没有冗余或不必要的数据。",
            },
          },
        },
      }).then((res) => {
        console.log(res.data.data);
      }); */

      // 创建文章
      /*axios({
        method: "post",
        url: "http://localhost:4000/graphql",
        data: {
          query: `
            mutation createArticle($article: createArticle!) {
              createArticle(article: $article) {
                id
                title
                body
              }
            }
          `,
          variables: {
            article: {
              title: "GraphQL 入门教程",
              body: "GraphQL 是一个用于 API 的查询语言和运行时。它提供了一种灵活的方式来描述数据，使得客户端能够准确地获取只需的数据，而且没有冗余或不必要的数据。",
            },
          },
        },
      }).then((res) => {
        console.log(res.data.data);
      });*/

      // 查询单个文章
      /*const id = 1;
      axios({
        method: "post",
        url: "http://localhost:4000/graphql",
        data: {
          query: `
            query getArticles($id: ID!) {
              article(id: $id) {
                title
                body
              }
            }
          `,
          variables: {
            id,
          },
        },
      }).then((res) => {
        console.log(res.data.data);
      });*/

      // 查询文章列表
      /* axios({
        method: "post",
        url: "http://localhost:4000/graphql",
        data: {
          query: `
            query getArticles {
              articles {
                title
              }
            }
          `,
        },
      }).then((res) => {
        console.log(res.data.data);
      });*/
    </script>
  </body>
</html>
